<template>
    <div class="shouye">
        <div class="shouye-top">
            <div class="shouye-logo">
                <img src="../../assets/images/icon .png" alt="">
            </div>
            <div class="shouye-desc">PocketGo</div>
        </div>
        <div class="shouye-content">
            <div class="sy-top">ঋণের পরিমাণ</div>
            <div class="sy-bdt">BDT 2100000</div>
            <div class="sy-lilv">সুদ প্রতিদিন 0.05% হিসাবে কম</div>
            <div class="sy-desc">
                <div class="sy-icon">
                    <div class="sy-one">
                        <img src="../../assets/images/sy-1.png" alt="">
                    </div>
                    <div class="sy-one">
                        <img src="../../assets/images/sy-2.png" alt="">
                    </div>
                    <div class="sy-one">
                        <img src="../../assets/images/sy-3.png" alt="">
                    </div>
                </div>
                <div class="sy-icon-desc">
                    <div class="sy-one">কম সুদ</div>
                    <div class="sy-two">কম সুদ অ্যাকাউন্ট করতে 24 ঘন্টা</div>
                    <div class="sy-three">উচ্চ কোটা</div>
                </div>
            </div>
            <div class="sy-btn" @click="toApply">অবিলম্বে আবেদন</div>
        </div>
        <div class="shouye-bottom">
            <!-- <img src="../../assets/images/shouyeicon.png" alt=""> -->
        </div>
        <div class="shouye-nav">
            <div class="shouye-nav-left">
                <div class="shouye-nav-icon">
                    <img src="../../assets/images/home-m.png" alt="">
                </div>
                <!-- <div class="shouye-nav-desc">বাড়ি</div> -->
            </div>
            <div class="shouye-nav-rigth" @click="$router.push('me')">
                <div class="shouye-nav-icon">
                    <img src="../../assets/images/user.png" alt="">
                </div>
                <!-- <div class="shouye-nav-desc">ব্যক্তিগত</div> -->
            </div>
        </div>
    </div>
</template>

<script>
import isNext from '../form/isNext.js'
export default {
    data() {
        return {
        }
    },
    methods: {
        //去贷款
        async toApply() {
            //判断有无登录
            // this.$router.push('/ocr')
            if (this.$store.state.isLogin) {
                //隐私协议
                this.$router.push('/toappyinsi')
                //获取安卓的权限并上报信息
                //判断下一步跳转哪里
                // isNext()
            } else {
                this.$router.push('/login')
            }
        }
    },
    created() {
        window.scrollTo({
            top: 0,
            behavior: "smooth"
        });
    },
}
</script>

<style lang="less" scoped>
.shouye {
    width: 100vw;
    height: (750/@a);
    box-sizing: border-box;
    padding-top: (31/@a);
    background-color: #6b82d8;

    .shouye-top {
        display: flex;
        justify-content: start;
        margin-left: (37/@a);

        .shouye-desc {
            font-size: (19/@a);
            font-family: Alibaba PuHuiTi;
            font-weight: 800;
            color: #FFFFFF;
            margin-left: (14/@a);
        }

        .shouye-logo {
            width: (39/@a);
            height: (31/@a);

            img {
                width: 100%;
            }
        }
    }

    .shouye-content {
        width: (320/@a);
        height: (410/@a);
        background: #415AB8;
        border-radius: (26/@a);
        margin-top: (36/@a);
        margin-left: (28/@a);
        padding-top: (35/@a);

        .sy-top {
            font-size: (16/@a);
            font-family: Nirmala UI;
            font-weight: bold;
            color: #FFFFFF;
            margin-bottom: (15/@a);
            margin-left: (106/@a);
        }

        .sy-bdt {
            font-size: (32/@a);
            font-family: Nirmala UI;
            font-weight: bold;
            color: #FFE011;
            margin-left: (61/@a);
        }

        .sy-lilv {
            font-size: (10/@a);
            font-family: Nirmala UI;
            font-weight: 400;
            color: #FFFFFF;
            margin-top: (15/@a);
            margin-left: (95/@a);
        }

        .sy-desc {
            .sy-icon {
                display: flex;
                justify-content: space-around;
                margin-top: (45/@a);

                .sy-one {
                    width: (34/@a);
                    height: (34/@a);

                    img {
                        width: 100%;
                    }
                }
            }

            .sy-icon-desc {
                display: flex;
                justify-content: start;

                div {
                    font-size: (10/@a);
                    font-family: Nirmala UI;
                    font-weight: bold;
                    color: #FFFFFF;
                }

                .sy-one {
                    margin-left: (30/@a);
                    margin-top: (15/@a);
                }

                .sy-two {
                    margin-top: (15/@a);
                    margin-left: (40/@a);
                    width: (120/@a);
                    height: (30/@a);
                }

                .sy-three {
                    margin-top: (15/@a);
                    margin-left: (5/@a);
                }
            }
        }

        .sy-btn {
            width: (251/@a);
            height: (51/@a);
            background: #FFE011;
            border-radius: (10/@a);
            margin-left: (34/@a);
            margin-top: (33/@a);
            text-align: center;
            line-height: (51/@a);
            font-size: (16/@a);
            font-family: Nirmala UI;
            font-weight: bold;
            color: #FFFFFF;
        }
    }

    .shouye-bottom {
        width: 100vw;
        height: (117/@a);
        opacity: 1;
        border-radius: (10/@a);
        margin-top: (14/@a);
        background-image: url(../../assets/images/shouyeicon.png);
        background-size: contain;
    }

    .shouye-nav {
        display: flex;
        justify-content: space-around;
        position: fixed;
        bottom: 0;
        width: 100vw;
        height: (52/@a);
        background: #FFFFFF;

        .shouye-nav-left {
            width: (30/@a);
            height: (24/@a);
            line-height: (35/@a);

            .shouye-nav-icon {
                margin-top: (10/@a);
                width: (30/@a);
                height: (24/@a);

                img {
                    width: 100%;
                }
            }

            .shouye-nav-desc {
                font-size: (9/@a);
                font-family: Nirmala UI;
                font-weight: bold;
                color: #415AB8;
            }
        }

        .shouye-nav-rigth {
            width: (25/@a);
            height: (30/@a);

            .shouye-nav-icon {
                margin-top: (10/@a);
                width: (25/@a);
                height: (25/@a);

                img {
                    width: 100%;
                }
            }

            .shouye-nav-desc {
                margin-top: (10/@a);
                font-size: (9/@a);
                font-family: Nirmala UI;
                font-weight: bold;
                color: #ACACAC;
            }
        }
    }

}
</style>

